<template>
	<view class="container">
		<uni-section title="个人信息" type="line" class="section">
			<view class="example">
				<uni-forms ref="baseForm" :modelValue="jobSeeker">
					<uni-forms-item label="姓名" required>
						<uni-easyinput v-model="jobSeeker.name" placeholder="请输入姓名" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="年龄" required>
						<uni-easyinput v-model.number="jobSeeker.age" placeholder="请输入年龄" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="性别" required>
						<select v-model="jobSeeker.gender" class="custom-select">
							<option disabled value="">请选择性别</option>
							<option v-for="option in genderOptions" :key="option.value" :value="option.value">
								{{ option.label }}
							</option>
						</select>
					</uni-forms-item>
					<uni-forms-item label="邮箱" required>
						<uni-easyinput v-model="jobSeeker.email" type="email" placeholder="请输入邮箱" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="学历" required>
						<uni-easyinput v-model="jobSeeker.education" placeholder="请输入学历" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="工作经历" required>
						<uni-easyinput v-model="jobSeeker.experience" placeholder="请输入工作经验" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="技能描述" required>
						<uni-easyinput v-model="jobSeeker.skills" placeholder="请输入技能描述" class="input-field" />
					</uni-forms-item>
					<uni-forms-item label="添加个人简历" required>
					    <button @click="addResume">添加个人简历</button>
					</uni-forms-item>


				</uni-forms>
				<u-button type="primary" @click="submitForm" class="submit-button">提交</u-button>
			</view>
		</uni-section>
	</view>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { http } from '@/utils/request.js';

const jobSeeker = ref({
  id: 1,
  name: '',
  gender: null,
  age: null,
  email: '',
  education: '',
  experience: '',
  skills: '',
  resume: '',
});

const genderOptions = [
    { label: '男', value: 0 },
    { label: '女', value: 1 },
    { label: '其他', value: 2 },
];

const selectedFile = ref(null);
const uploading = ref(false);
const uploadProgress = ref(0);
const uploadMessage = ref('');

onMounted(async () => {
  try {
    const response = await http({
      url: `/jobSeeker/getJobSeekerById/${jobSeeker.value.id}`, 
      method: 'GET',
    });

    if (response.flag) {
		console.log(response);
      Object.assign(jobSeeker.value, response.shuju); 
    } else {
      console.error("获取数据失败：", response.shuju);
    }
  } catch (error) {
    console.error("请求错误：", error);
  }
});


const submitForm = async () => {
  console.log(jobSeeker.value);
  try {
    const response = await http({
      url: '/jobSeeker/update',
      method: 'POST',
      data: jobSeeker.value, 
    });

    if (response.flag) {
      console.log("提交成功：", response);
    } else {
      console.error("提交失败：", response.shuju);
    }
  } catch (error) {
    console.error("请求错误：", error);
  }
};
const addResume = async () => {
    try {
        const response = await http({
            url: `/jobSeeker/addResume/${jobSeeker.value.id}`,
            method: 'POST'
        });

        if (response.flag) {
            console.log(response.shuju);

            // 存储 shuju 到本地
            uni.setStorageSync('jobSeekerData', response.shuju);

            // 跳转到 experience 页面
            uni.navigateTo({
                url: '/pages/experience/experience'
            });

            uni.setNavigationBarTitle({
                title: '添加简历'
            });
        } else {
            console.error("添加简历失败：", response.shuju);
            uni.showToast({
                title: '添加简历失败',
                icon: 'none'
            });
        }
    } catch (error) {
        console.error("请求错误：", error);
        uni.showToast({
            title: '系统错误',
            icon: 'none'
        });
    }
};



</script>

<style scoped>
.container {
  padding: 20px;
  background-color: #f9f9f9;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.section {
  margin-bottom: 20px;
}

.example {
  margin-bottom: 20px;
}

.input-field {
  border-radius: 4px;
  border: 1px solid #ccc;
  padding: 10px;
  font-size: 16px;
}

.progress-bar {
  width: 100%;
  height: 10px;
  background-color: #007BFF;
  margin-top: 10px;
}

.uploading-status {
  margin-top: 10px;
}

.upload-progress {
  display: inline-block;
  margin-left: 10px;
  font-weight: bold;
}

.upload-message {
  color: #d9534f;
  margin-top: 10px;
}

.custom-select {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #fff;
  font-size: 16px;
  color: #333;
  cursor: pointer;
}

.submit-button {
  margin-top: 20px;
  width: 100%;
  padding: 10px;
  font-size: 18px;
  background-color: #007BFF;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.submit-button:hover {
  background-color: #0056b3;
}
</style>
